<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8" />
    <title>预约成功</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta content="width=device-width, initial-scale=1" name="viewport" />
    <link href="css/base.css" rel="stylesheet" type="text/css" />
    <link href="css/button.css" rel="stylesheet" type="text/css" />
    <link href="css/icon.css" rel="stylesheet" type="text/css" />
    <link href="css/appointment-success.css" rel="stylesheet" type="text/css" />
</head>

<body>
    <div class="container">
        <div class="card">
            <div id="head-dom" class="card-head"></div>
            <script id="head" type="text/html">
                <img class="card-media" src="{{ pic }}" />
                <div class="card-head-title">&yen;{{ money }}/月</div>
                <div class="card-head-mask"></div>
            </script>
        </div>
    </div>
    <div id="person-dom" class="person-info"></div>
    <script id="person" type="text/html">
        <img class="circle-image" src="{{ housekeeper_logo }}">
        <div class="user-info">
            <span class="username">{{ housekeeper_username }}</span>
            <a href="comment.html?id={{ housekeeper_id }}">查看评价</a>
            <div class="star-bar">
                {{ housekeeper_star | star }}
            </div>
            <span class="font-blue">{{ housekeeper_star }}分</span>
        </div>
    </script>
    <div class="body-content-title">TIPS</div>
    <div class="body-content">
        Honey, 我是你的管家孟柯。 接下来的行程中，将由我带你更深入的了解小家，共度愉快的时光。
        <p>我将尽快联系你，为你带来最好的服务！ 记得保持你的手机畅通哦
        </p>
        你的小家，我的大事！
    </div>
    <div class="footer-padding"></div>
    <div class="tool-bar">
        <a class="favorite" href="javascript:;">
            <i class="icon icon-star-red-blank"></i>
        </a>
        <span class="separator"></span>
        <a id="phone" href="javascript:;">
            <i class="icon icon-phone"></i>
        </a>
        <a href="index.html" class="btn yellow">继续浏览</a>
    </div>
    <script src="js/jquery.min.js" type="text/javascript"></script>
    <script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js" type="text/javascript"></script>
    <script src="js/template.js" type="text/javascript"></script>
    <script src="js/base.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function() {
            bee.wxConfig(function() {
                bee.hideAllNonBaseMenuItem();
            }, function(res) {});

            bee.request({
                url: '/Index/Order/appointment',
                data: {
                    skuid: bee.getQueryString('housing_id'),
                    id: bee.getQueryString('id')
                },
                success: function(result) {
                    bee.template('head', result.info, true);
                    bee.template('person', result.info, true);
                    $('#phone').attr('href', 'tel:' + result.info.housekeeper_mobile);
                }
            });

            $('body').on('click', 'a.favorite', function(e) {
                var dom = $(this).find('.icon');
                if (dom.hasClass('icon-star-red-blank')) {
                    bee.request({
                        url: '/Member/Index/collection',
                        data: {
                            type: 1,
                            housing_id: bee.getQueryString('id'),
                        },
                        success: function(result) {
                            dom.removeClass('icon-star-red-blank').addClass('icon-star-red');
                        }
                    });
                } else {
                    bee.request({
                        url: '/Member/Index/collection',
                        data: {
                            type: 2,
                            housing_id: bee.getQueryString('id'),
                        },
                        success: function(result) {
                            dom.removeClass('icon-star-red').addClass('icon-star-red-blank');
                        }
                    });
                }
            });
        });
    </script>
</body>

</html>
